<template>
  <div id="app">
    <!-- ref属性类似id属性 -->
    <h1 ref="title">你好！同学</h1>
    <button @click="showmsg" ref="btu">点击我读取信息</button>
    <School ref="sch"></School>
    <!-- 在脚手架里面可以连续使用多个自结束标签，不会报错 -->
    <!-- <School/> -->

    <!-- 使用Student 传入数据 -->
    <Student name="小明" sex="男" :age="18"></Student>
  </div>
</template>

<script>
import School from './components/School.vue'
import Student from './components/Student.vue'

export default {
  name: 'App',
  components: {
    School,
    Student
  },
  methods: {
    showmsg(){
      console.log(this.$refs.title)
      console.log(this.$refs.btu)
      console.log(this.$refs.sch)
    }
  },
}
</script>

<style>

</style>
